import { Button, Modal, Form, Input  } from 'antd';
import React, { useState,useRef ,useEffect} from 'react';
const App = ({addmodalopen,closeaddmodalfn,isadd,editIndex,eitItem}) => {
  const [isModalOpen, setIsModalOpen] = useState(false);
  let myref = useRef(null)
  const showModal = () => {
    setIsModalOpen(true);
  };
  const handleOk = () => {
    setIsModalOpen(false);
  };
  const handleCancel = () => {
    closeaddmodalfn({close:false})
  };
  const onFinish = (values) => {

    isadd === "新增" ? closeaddmodalfn({close:false,values,isadd:"新增"}) : closeaddmodalfn({close:false,values,isadd:"编辑"})
  }
  const onFinishFailed = (errorInfo) => {
    console.log('Failed:', errorInfo);
  };
  useEffect(()=>{
      if (isadd === "新增") {
         console.log(myref.current); 
         myref.current &&  myref.current.resetFields()
      } else {
        myref.current && myref.current.setFieldsValue(eitItem)

      }
  },[isadd,editIndex])
  return (
    <>
     
      <Modal title="Basic Modal" open={addmodalopen} onOk={handleOk} onCancel={handleCancel} footer={null}>
        <Form
        ref = {myref}
        name="basic"
        labelCol={{
            span: 8,
        }}
        wrapperCol={{
            span: 16,
        }}
        initialValues={{
            remember: true,
        }}
        onFinish={onFinish}
        onFinishFailed={onFinishFailed}
        autoComplete="off"
        >
        <Form.Item
            label="name"
            name="name"
            rules={[
            {
                required: true,
                message: 'Please input your username!',
            },
            ]}
        >
            <Input />
        </Form.Item>
        <Form.Item
            label="date"
            name="date"
            rules={[
            {
                required: true,
                message: 'Please input your username!',
            },
            ]}
        >
            <Input />
        </Form.Item>
        <Form.Item
            label="address"
            name="address"
            rules={[
            {
                required: true,
                message: 'Please input your username!',
            },
            ]}
        >
            <Input />
        </Form.Item>

       


        <Form.Item
            wrapperCol={{
            offset: 8,
            span: 16,
            }}
        >
            <Button type="primary" htmlType="submit">
            Submit
            </Button>
        </Form.Item>
        </Form>
      </Modal>
    </>
  );
};
export default App;